<script setup lang="ts">
const items = [
 {
    image: './public/img/img_1.png'
  }, {
    image: './public/img/img_2.png'
  }, {
    image: './public/img/img_3.png'
  }, {
    image: './public/img/img_4.png'
  }, {
    image: './public/img/img_5.png'
  }
]
</script>

<template>
  <div class="common-layout-zmd">
    <el-carousel :interval="5000" type="card" height="410px">
      <el-carousel-item v-for="item in items" :key="item">
        <div class="image_url">
          <img :src="item.image" alt="" width="100%" height="100%">
        </div>
      </el-carousel-item>
    </el-carousel>
  </div>
</template>

<style scoped>
.image_url{
  width: 100%;
  height: 100%;
  box-shadow: 5px 10px 10px #000000;
}
</style>